<template>
	<view>
		<view class="M_3 bg_fff B_radius_5 P_2">
			<view class="   flex_row_around">
				<view class="fontS_10 flex_colC">
					<view style="background-color: #d7f8e7;" class="color_up">
						日币收益率
					</view>
					<view class="fontS_20 font_weight_bold color_up">
						{{item.rate}}%
					</view>
					<view class="color_gray">
						参考年华率
					</view>
				</view>
				
				<view class="flex_colC">
					<view class="font_weight_bold fontS_18">
						{{item.day}}天
					</view>
					<view class="fontS_10 color_gray PT_2">
						锁仓期限
					</view>
				</view>
				
				
			</view>
			
			<view class="flex_row_between MLR_2 P_2 B_radius_5 MT_3" style="border: 1px solid #CECECE;">
				
				<view class="flex_rowL">
					<view class="PR_2">
						锁仓金额
					</view>
					<input v-model="num" placeholder="请输入金额" class="fontS_14 W_20vw" type="number" value="" />
				</view>
				
				<view class="flex_rowL">
					<view class="">
						KSA
					</view>
					<view class="MLR_2 H_4vw bg_gray" style="width: 1px;">
						
					</view>
					<view @click="allNum" class="pub_color">
						全部
					</view>
				</view>
			</view>
			
			<view class="PL_2 PT_1 color_gray">
				可用余额:{{Number(ksa.money).toFixed(2)}}
			</view>
			
			<view class="flex_rowC PT_4 PB_2">
				<view
				@click="submit"
				style="background-color: #d8dff8;" class="pub_color B_radius_5 PTB_2 PLR_4 fontS_10">
					确认锁仓
				</view>
				
			</view>
		</view>
		
		
		<view class="bg_fff P_2 MT_3">
			<view class="font_weight_bold pub_color fontS_16 PTB_3 line_bom">
				我的订单
			</view>
			<view class="flex_row_between PTB_3 fontS_14 line_bom">
				<view class="W_p25 font_weight_bold flex_rowC">
					天数
				</view>
				<view class="W_p25 font_weight_bold flex_rowC">
					金额
				</view>
				<view class="W_p25 font_weight_bold flex_rowC">
					预计收益
				</view>
				<view class="W_p25 font_weight_bold flex_rowC">
					日期
				</view>
			</view>
			
			<view v-for="(item,index) in cangList" :key='index'
			class="flex_row_between PTB_3 fontS_14 line_bom">
				<view class="W_p25 flex_rowC">
					{{item.cycle && item.cycle.day}}
				</view>
				<view class="W_p25 flex_rowC">
					{{item.amount}}
				</view>
				<view class="W_p25 flex_rowC">
					{{item.except_reward}}
				</view>
				<view class="W_p25 flex_rowC fontS_12">
					{{item.updated_at}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				item:{},
				num:'',
				cangList:[],
				page:1,
				showText:'',
				state:true,
				usdt:{},
				ksa:{}
			}
		},
		onLoad(options) {
			this.item = JSON.parse(options.info);
			this.getList()
			this.getSort()
		},
		onReachBottom() {
			if (this.state) {
				this.showTxt = '加载中...';
				this.page++
				this.getList();
			}
		},
		methods: {
			getSort(){
				let _this = this;
				this.$req('account/index',{},function(res){
					let list = res.data;
					list.forEach((item)=>{
						if(item.currency_name=='KSA'){
							_this.ksa = item;
							// _this.ksas = item.currency
						}
						if(item.currency_name=='USDT'){
							_this.usdt = item;
							// _this.usdt = item.currency
						}
					})
				})
			},
			allNum(){
				this.num = Number(this.ksa.money).toFixed(2);
			},
			getList(){
				let _this = this;
				this.$req('pledge/index',{page:_this.page},(res)=>{
					if(res.code==1){
						if(res.data.list && res.data.list.length>0){
							if(_this.page==1){
								_this.cangList = res.data.list;
							}else{
								_this.cangList = _this.cangList.concat(res.data.list)
							}
						}else{
							_this.showText = '没有更多了';
							_this.state = false;
						}
					}else{
						_this.toast(res.msg)
					}
				})
			},
			submit(){
				let _this = this;
				if(!this.num){
					this.toast('请输入金额')
				}else{
					this.$req('pledge/create',{
						cycle_id:_this.item.id,
						amount:_this.num
					},function(res){
						_this.toast(res.msg);
						_this.getList()
						_this.getSort()
					})
				}
				
			}
		}
	}
</script>

<style>
.W_p25{
	width: 25%;
}
</style>
